<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <style>
    .ancestors * {
      display: block;
      border: 2px solid lightgrey;
      color: lightgrey;
      padding: 5px;
      margin: 15px;
    }
  </style>
  <script src="/libs/jquery/1.10.2/jquery.min.js">
  </script>
  <script>
    $(document).ready(function () {
      $("span").parent().css({"color": "blue", "border": "5px solid red"});
    });
  </script>
</head>
<body>

<div class="ancestors">
  <div style="width:500px;">div (曾祖父元素)ddd
    <ul>qqqqul (祖父元素)
      <li>li (父元素)
        <span>span</span>
      </li>
    </ul>
  </div>

  <div style="width:500px;">div (祖父元素)
    <p>pabc (父元素)
      <span>span</span>
    </p>
  </div>
</div>
<button style="padding: 10px 5px 9px 30px;">Adding A B C</button>
<button style="padding: 10px;">Adding A B D</button>
<script>
  $("button").on("click",function(){
    var version = $().jquery;
    alert("你正在运行的jQuery版本为: " + version);
  });
</script>
</body>
</html>